<template>
    <div class="page_404">
        <headerBar :title="title"></headerBar>
        <img src="../assets/images/404.png" class="img_404">
        <div class="tip_404">订单正在查询中请稍等</div>
    </div>
</template>


<script>
import headerBar from "@/components/headerBar";
import {
  getAlipayStatus
} from "@/apis/apis";

export default {
  components: {
    headerBar
  },
  data() {
    return {
      time: 5,
      id: "",
      title: '订单状态'
    };
  },
  mounted() {
    //返回用户支付结果
    if(this.$route.query.ali_order) {
      getAlipayStatus(this.$route.query.ali_order).then(res => {
        if(res._status == 0) {
          if(res.status == 1) {
            this.$toast({
              message: "支付成功",
              position: "bottom"
            });
            this.$router.push("/personal");
          }
          if(res.status == 0) {
            this.$toast({
              message: "支付失败",
              position: "bottom"
            });
            this.$router.push("/personal");
          }
        }
      })
    }
  },
  beforeDestroy() {
    if (this.id) clearInterval(this.id);
  }
};
</script>


<style lang="scss">
.page_404 {
  height: 100%;
  width: 100%;
  min-height: 100vh;
  position: relative;
  background-color: #fff;
}
.img_404 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #fff;
  height: 300px;
  width: 300px;
}
.tip_404 {
  position: absolute;
  top: 100px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 18px;
  font-weight: 600;
}
</style>
